<template>
	<view>
		<view class="upBox">
			<text class="rowTitle">默认删除按钮样式</text>
			<hlUploadImg ref="hlUploadImg" :imgList="oldImgList"></hlUploadImg>
			<text class="rowTitle">自定义删除按钮样式</text>
			<hlUploadImg ref="hlUploadImg" :imgList="oldImgList" :delBtn="delStyle"></hlUploadImg>
			
			<text class="rowTitle">使用图片作为删除按钮</text>
			<hlUploadImg ref="hlUploadImg" :imgList="oldImgList" :delBtn="delStyle2"></hlUploadImg>
		</view>
	</view>
</template>
<script>
	import hlUploadImg from '../../components/hlUploadImg/hlUploadImg.vue';
	export default {
		components: {
			hlUploadImg
		},
		data() {
			return {
				oldImgList: [
					'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=2583035764,1571388243&fm=26&gp=0.jpg',
					'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3876535482,3811402221&fm=11&gp=0.jpg'
				],
				delStyle: {
					icon: 'icon-close',
					style: {
						display: 'block',
						width: '40upx',
						height: '40upx',
						textAlign: 'center',
						color: '#ffffff',
						background: '#000000',
						lineHeight: '40upx',
						right: '0',
						top: '0'
					}
				},
				delStyle2:{
					icon: '../../static/del.png',
					style: {
						width: '40rpx',
						height: '40rpx',
						left:'0',
						bottom:'0'
					}
				}

			};
		}
	};
</script>

<style lang="scss"></style>
